今天這篇文章會介紹CSS文字大小、文字粗細、字體和字型,這些都是有關文字樣式的相關屬性:
文字大小
屬性:font-size:
-
絕對尺寸:設定指定的文字大小
xx-large、x-large、large、medium、small、x-small、xx-small
(依序為由大到小)
-
相對尺寸:依照父元素文字大小調整
larger、 smaller(比父元素大、小)
-
常用尺寸單位:
px(像素)
em(倍數乘以根元素的 px 值。若根元素為16px,現今元素設為2em就等於32px)
-
百分比(%):
100%:與父元素字型大小相同
50%:比父元素縮小1/2倍
200%:比父元素放大2倍
文字粗細
屬性:font-weight:
-
normal:預設值
-
bold:粗體
-
bolder:較父元素更粗
-
lighter: 較父元素更細
-
100~900(小~大)
字體
屬性:font-style:
字型
屬性:font-family:
-
font-family:Microsoft JhengHei(微軟正黑體)
文字的字型當然還有非常多種,可以到網路上找尋更多的字體樣式!
文字樣式速寫法
屬性:font:
-
font:italic bold ,Microsoft JhengHei, 30px;
補充:font-size和font-family 必需在font屬性中給定
結語
這篇文章介紹了CSS文字的屬性,font-size、font-weight、font-style、font-family、font,這些都是拿來調整文字樣式的。下一篇將會介紹表格框線的樣式和清單的樣式,在前面html文章中只有介紹到表格框線的broder屬性、無序清單、有序清單的type屬性等,接下來會介紹例如:表格的框線設定為虛線,而在清單中我可以使用img來代替符號等非常多的效果!